import Vue from "vue";
import VueRouter from "vue-router";
import HomeView from "../views/HomeView.vue";
import store from "../store/index"; // 引入vuex
Vue.use(VueRouter);

// 解决路由bug
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push(location, onResolve, onReject) {
    if (onResolve || onReject) return originalPush.call(this, location, onResolve, onReject);
    return originalPush.call(this, location).catch((err) => err);
};
const routes = [
    // 主页
    {
        path: "/",
        name: "home",
        component: HomeView,
        meta: { show: true }, // 是否显示tab栏切换
    },
    // 主页搜索界面
    {
        path: "/search",
        name: "search",
        component: () => import("../components/SearchView.vue"),
    },
    // 主页的商品分类页 中的地址页
    {
        path: "/home/menus/6",
        name: "menus6",
        component: () => import("../components/menus6/Menus6View.vue"),
    },
    //  主页的商品分类页 中的订单列表
    {
        path: "/home/menus/7",
        name: "menus7",
        component: () => import("../components/my/MyOrders.vue"),
    },
    //  主页的商品分类页 中的订单列表
    {
        path: "/home/menus/0",
        name: "menus1",
        component: () => import("../views/CategoryView.vue"),
    },
    // 主页的商品分类页 中的收藏页
    {
        path: "/home/menus/4",
        name: "menus4",
        component: () => import("../components/my/CollectView.vue"),
    },
    {
        path: "/home/menus/1",
        name: "menus1",
        component: () => import("../components/BlankView.vue"),
    },
    {
        path: "/home/menus/2",
        name: "menus2",
        component: () => import("../components/BlankView.vue"),
    },
    {
        path: "/home/menus/3",
        name: "menus3",
        component: () => import("../components/BlankView.vue"),
    },
    {
        path: "/home/menus/5",
        name: "menus5",
        component: () => import("../components/BlankView.vue"),
    },
    // 主页下的更多
    {
        path: "/groom/:listIndex",
        name: "groom",
        props: true,
        component: () => import("../components/groom/MyGroom.vue"),
    },
    // 主页下的促销单品
    {
        path: "/promotion",
        name: "promotion",
        component: () => import("../components/groom/PromotionView.vue"),
    },
    // 商品详情
    {
        path: "/category",
        name: "category",
        component: () => import("../views/CategoryView.vue"),
        meta: { show: true }, // 是否显示tab栏切换
    },
    // 购物车
    {
        path: "/cart",
        name: "cart",
        component: () => import("../views/CartView.vue"),
        meta: { show: true, islogin: true }, // show是否显示tab栏切换 islogin是否需要登录
    },
    // 下单界面
    {
        path: "/orders/cat",
        name: "orderscat",
        props: true,
        component: () => import("../components/cart/OrdersView.vue"),
    },
    // 个人中心
    {
        path: "/myview",
        name: "myview",
        component: () => import("../views/MyView.vue"),
        meta: { show: true, islogin: true }, // show是否显示tab栏切换 islogin是否需要登录
    },
    // 个人中心的六个货物状态
    {
        path: "/orders/:ordid",
        props: true,
        name: "orders",
        component: () => import("../components/my/MyOrders.vue"),
    },
    // 个人中心下的收藏
    {
        path: "/collect",
        name: "collect",
        component: () => import("../components/my/CollectView.vue"),
    },
    // 个人中心下的充值中心
    {
        path: "/balance",
        name: "balance",
        component: () => import("../components/my/BalanceView.vue"),
    },
    // 冲钱页面
    {
        path: "/addmoney",
        name: "addmoney",
        component: () => import("../components/my/AddMoney.vue"),
    },
    {
        path: "/info",
        name: "info",
        component: () => import("../components/my/MyInfo.vue"),
    },
    // 商品详情的副业
    {
        path: "/categoryson/:cateid/:catetitle",
        name: "categoryson",
        props: true,
        component: () => import("../components/category/CateSon.vue"),
    },
    // 商品的全部内容
    {
        path: "/details/:detaid",
        name: "details",
        props: true,
        component: () => import("../components//DetailsView.vue"),
    },
    //登录
    {
        path: "/login",
        name: "login",
        component: () => import("../components/login/LoginView.vue"),
    },
    //注册
    {
        path: "/reginster",
        name: "reginster",
        component: () => import("../components/login/RegisterView.vue"),
    },
];

const router = new VueRouter({
    mode: "hash",
    base: process.env.BASE_URL,
    routes,
});
router.beforeEach((to, from, next) => {
    // 拦截页面

    // 获取vuex的token
    let token = store.getters.mytoken;
    if (to.meta.islogin) {
        // 判断此时浏览器中有无token值
        if (token) {
            next();
            return;
        } else {
            // 存储当前的要去到的页面路径
            store.commit("mypath", to.path);
            // 浏览器缓存也存一份,防止刷新
            localStorage.setItem("mypath", to.path);

            // 没有token代表还未登录,要去到登录页面
            next("/login");
            return;
        }
    }
    next();
});

export default router;
